<!-- 底部 -->
<template>
  <!--site-bottom-->
  <div class="site-bottom pt-50 pb-50 bg-white">
    <div class="container">
      <div class="row">
        <div class="col-lg-4 col-md-6">
          <div class="sidebar-widget widget-latest-posts mb-30 wow fadeInUp animated">
            <div class="widget-header-2 position-relative mb-30">
              <h5 class="mt-5 mb-30">优选</h5>
            </div>
            <div class="post-block-list post-module-1">
              <ul class="list-post">
                <li class="mb-30" v-for="i in 4" :key="i">
                  <ky-article :data="documents.records[i+(0*4)]" :tag="Array.from(tags)" module="mini"></ky-article>
                </li>
                
              </ul>
            </div>
          </div>
        </div>
        <div class="col-lg-4 col-md-6">
          <div class="sidebar-widget widget-latest-posts mb-30 wow fadeInUp animated" data-wow-delay="0.2s">
            <div class="widget-header-2 position-relative mb-30">
              <h5 class="mt-5 mb-30">互动</h5>
            </div>
            <div class="post-block-list post-module-1">
              <ul class="list-post">
                <li class="mb-30" v-for="i in 4" :key="i">
                  <ky-article :data="documents.records[i+(1*4)]" :tag="Array.from(tags)" module="mini"></ky-article>
                </li>
                
              </ul>
            </div>
          </div>
        </div>
        <div class="col-lg-4">
          <div class="sidebar-widget widget-latest-posts mb-30 wow fadeInUp animated" data-wow-delay="0.4s">
            <div class="widget-header-2 position-relative mb-30">
              <h5 class="mt-5 mb-30">创新</h5>
            </div>
            <div class="post-block-list post-module-1">
              <ul class="list-post">
                <li class="mb-30" v-for="i in 4" :key="i">
                  <ky-article :data="documents.records[i+(2*4)]" :tag="Array.from(tags)" module="mini"></ky-article>
                </li>
              </ul>
            </div>
          </div>
        </div>
      </div>
      <div class="sidebar-widget widget-latest-posts mb-30 mt-20 wow fadeInUp animated">
        <div class="widget-header-2 position-relative mb-30">
          <h5 class="mt-5 mb-30">更多</h5>
        </div>
        
      </div>
    </div>
    <div class="container pr-20">
  <el-button icon="el-icon-refresh" circle @click="reFresh"></el-button>
    </div>
    <!--container-->
  </div>
</template>

<script>
  //这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
  //例如：import 《组件名称》 from '《组件路径》';
  import KyArticle from '@/components/module/ky-article'
  export default {
    //import引入的组件需要注入到对象中才能使用
    components: {
      KyArticle
    },
    data() {
      //这里存放数据
      return {
        tags:new Set(),
        documents: {
    "records": [
        {
            "id": 75,
            "title": "修复发布出现相同文章问题",
            "timestamp": 1646816587361,
            "context": null,
            "tag": "27-",
            "status": null,
            "userid": 2022227,
            "background": "http://dev.kingyin.club:9000/cloud/2022225/背景图片/1629775603294_bg8_1646715379568.jpg",
            "slogan": "已经不会出现这类问题了",
            "views": 0,
            "updatetime": 1646990568861
        },
        {
            "id": 74,
            "title": "出现了多篇一样的文章",
            "timestamp": 1646816130863,
            "context": null,
            "tag": "27-",
            "status": null,
            "userid": 2022227,
            "background": "http://dev.kingyin.club:9000/cloud/2022225/背景图片/2021_9_9_1_1646715126651.jpg",
            "slogan": "因为在创作中心的状态处于“新建写作”状态，多次保存或者发布会创建多份文章",
            "views": 0,
            "updatetime": 1646990610330
        },
        {
            "id": 72,
            "title": "幽小灵运营",
            "timestamp": 1646815098396,
            "context": null,
            "tag": "24-",
            "status": null,
            "userid": 2022227,
            "background": "http://dev.kingyin.club:9000/cloud/2022225/背景图片/1629775618356_bg10_1646715380151.jpg",
            "slogan": "博客运营就由幽小灵负责啦",
            "views": 0,
            "updatetime": 1646988433281
        },
        {
            "id": 71,
            "title": "我可以白嫖吗",
            "timestamp": 1646814999563,
            "context": null,
            "tag": "27-",
            "status": null,
            "userid": 2022227,
            "background": "http://dev.kingyin.club:9000/cloud/2022225/背景图片/1653924632_1646715126685.jpeg",
            "slogan": "不可以，谢谢",
            "views": 0,
            "updatetime": 1646988443206
        },
        {
            "id": 70,
            "title": "博客会收费吗",
            "timestamp": 1646814936185,
            "context": null,
            "tag": "27-",
            "status": null,
            "userid": 2022227,
            "background": "http://dev.kingyin.club:9000/cloud/2022225/背景图片/1653924630_1646715163430.jpeg",
            "slogan": "没有，下次一定",
            "views": 0,
            "updatetime": 1646988452633
        },
        {
            "id": 69,
            "title": "为什么会有这个博客",
            "timestamp": 1646814873264,
            "context": null,
            "tag": "27-",
            "status": null,
            "userid": 2022227,
            "background": "http://dev.kingyin.club:9000/cloud/2022225/背景图片/1629775609563_bg9_1646715137303.jpg",
            "slogan": "因为我要做毕业设计，这个就是我的毕业设计",
            "views": 0,
            "updatetime": 1646988461519
        },
        {
            "id": 68,
            "title": "博客言语行为规范",
            "timestamp": 1646814795307,
            "context": null,
            "tag": "25-",
            "status": null,
            "userid": 2022227,
            "background": "http://dev.kingyin.club:9000/cloud/2022225/背景图片/1629775646339_bg11_1646715380325.jpg",
            "slogan": "早睡早起",
            "views": 0,
            "updatetime": 1646990614981
        },
        {
            "id": 67,
            "title": "博客会收集个人隐私吗",
            "timestamp": 1646814697595,
            "context": null,
            "tag": "27-",
            "status": null,
            "userid": 2022227,
            "background": "http://dev.kingyin.club:9000/cloud/2022225/背景图片/1629775577121_bg4_1646715173899.jpg",
            "slogan": "收集不了，也不会收集",
            "views": 0,
            "updatetime": 1646990593482
        },
        {
            "id": 66,
            "title": "可以和粉丝聊天吗？",
            "timestamp": 1646814645752,
            "context": null,
            "tag": "27-",
            "status": null,
            "userid": 2022227,
            "background": "http://dev.kingyin.club:9000/cloud/2022225/背景图片/1629775652347_bg12_1646715163445.jpg",
            "slogan": "还不能聊天呢",
            "views": 0,
            "updatetime": 1646990587243
        },
        {
            "id": 65,
            "title": "可以加好友吗",
            "timestamp": 1646814600750,
            "context": null,
            "tag": "27-",
            "status": null,
            "userid": 2022227,
            "background": "http://dev.kingyin.club:9000/cloud/2022225/背景图片/2021_9_9_10_1646715126688.jpg",
            "slogan": "目前博客的好友关系以关注粉丝的形式呈现，互相关注吧",
            "views": 0,
            "updatetime": 1646990575096
        },
        {
            "id": 64,
            "title": "为什么我的评论突然消失了？",
            "timestamp": 1646814516630,
            "context": null,
            "tag": "27-",
            "status": null,
            "userid": 2022227,
            "background": "http://dev.kingyin.club:9000/cloud/2022225/背景图片/2021_9_9_18_1646715126651.jpg",
            "slogan": "评论删除会将评论下面的所有关联评论都删除，但是在消息通知中会保留评论通知",
            "views": 0,
            "updatetime": 1646990581826
        },
        {
            "id": 63,
            "title": "访问别人的主页留下的记录可以删除吗",
            "timestamp": 1646814403024,
            "context": null,
            "tag": "27-",
            "status": null,
            "userid": 2022227,
            "background": "http://dev.kingyin.club:9000/cloud/2022225/背景图片/2021_9_9_27_1646715077649.jpg",
            "slogan": "每日一访，增进友谊情感",
            "views": 0,
            "updatetime": 1646990624994
        },
        {
            "id": 62,
            "title": "支持其他写作方式吗？例如markdown文件新式",
            "timestamp": 1646814316109,
            "context": null,
            "tag": "27-",
            "status": null,
            "userid": 2022227,
            "background": "http://dev.kingyin.club:9000/cloud/2022225/背景图片/2021_9_9_3_1646715063754.jpg",
            "slogan": "正有此意，如果可以支持上传Markdown文件展示文章就好了，md暂时不会增加",
            "views": 0,
            "updatetime": 1646990632962
        },
        {
            "id": 61,
            "title": "如何写作",
            "timestamp": 1646814172417,
            "context": null,
            "tag": "27-",
            "status": null,
            "userid": 2022227,
            "background": "http://dev.kingyin.club:9000/cloud/2022225/背景图片/2021_9_9_3_1646715063754.jpg",
            "slogan": "目前仅有富文本写作的途径",
            "views": 0,
            "updatetime": 1646990644212
        },
        {
            "id": 60,
            "title": "希望带来什么新功能呢？",
            "timestamp": 1646814057780,
            "context": null,
            "tag": "26-",
            "status": null,
            "userid": 2022227,
            "background": "http://dev.kingyin.club:9000/cloud/2022225/背景图片/2021_9_9_13_1646715113319.jpg",
            "slogan": "增加一个校园商店怎么样呢？ 购买酷酷的东西，物美价廉！",
            "views": 0,
            "updatetime": 1646990656575
        },
        {
            "id": 59,
            "title": "共享云注意事项",
            "timestamp": 1646812397926,
            "context": null,
            "tag": "30-",
            "status": null,
            "userid": 2022227,
            "background": "http://dev.kingyin.club:9000/cloud/2022225/背景图片/1653924629_1646715163370.jpeg",
            "slogan": "博客的所有媒体文件都存储再共享云中，博主们可以在共享云空间互相分享文件，分享快乐",
            "views": 0,
            "updatetime": 1646990666227
        }
    ],
    "total": 17,
    "size": 16,
    "current": 1,
    "orders": [],
    "optimizeCountSql": true,
    "hitCount": false,
    "countId": null,
    "maxLimit": null,
    "searchCount": true,
    "pages": 2
}
      };
    },
    //监听属性 类似于data概念
    computed: {},
    //监控data中的数据变化
    watch: {},
    //方法集合
    methods: {
      reFresh() {
        
        this.documents.current = this.documents.current+1;
        
        this.getBottom();
      },
      async getBottom() {
        this.isOp = true;
        if (this.documents.pages != -1 && (this.documents.total - this.documents.current*this.documents.size)<15) {
          this.documents.current = 1;
        }
        const pram = {
          current:this.documents.current
        }
        var res = await this.$api.core.bottom(pram)
        if (res.code == 20000) {
          this.documents = res.data;
          this.getTags();
        }
        this.isOp = false;
      },
      async getTags() {
        var arr = new Set()
        for (const d of this.documents.records) {
          if (!this.tags.has(d.userid)) {
            arr.add(d.userid);
          }
        }
        if (arr.size == 0) {
          return;
        }
        const pram = {
          ids:Array.from(arr).sort()
        }
        var res = await this.$api.core.tagIds(pram)
        if (res.code == 20000) {
          for (const t of res.data) {
            this.tags.add(t);
          }
        }
        this.$forceUpdate()
      },
    },
    //生命周期 - 创建完成（可以访问当前this实例）
    created() {

    },
    //生命周期 - 挂载完成（可以访问DOM元素）
    mounted() {
      this.getBottom()
    },
    beforeCreate() {}, //生命周期 - 创建之前
    beforeMount() {}, //生命周期 - 挂载之前
    beforeUpdate() {}, //生命周期 - 更新之前
    updated() {}, //生命周期 - 更新之后
    beforeDestroy() {}, //生命周期 - 销毁之前
    destroyed() {}, //生命周期 - 销毁完成
    activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
  }

</script>
<style>

</style>
